<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0,user-scalable=no,minimal-ui">
    <meta name="description" content="">
    <meta name="author" content="">
    <link rel="icon" href="../img/asset-favico.ico">
    <title>编辑信息</title>
    <link rel="stylesheet" href="../css/page-health-orderInfo.css" />
    <link rel="stylesheet" href="../plugins/elementui/index.css" />
    <script src="../plugins/jquery/dist/jquery.min.js"></script>
    <script src="../plugins/healthmobile.js"></script>
    <script src="../plugins/datapicker/datePicker.js"></script>
    <script src="../plugins/vue/vue.js"></script>
    <script src="../plugins/vue/axios-0.18.0.js"></script>
    <script src="../plugins/elementui/index.js"></script>
    <script type="text/javascript"  src="http://api.map.baidu.com/api?v=3.0&ak=SzgYTcpY8xTpLn3K5W7XO7xaIhIypROX"></script>

    <!-- 引入样式 -->
    <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
    <!-- 引入组件库 -->
    <script src="https://unpkg.com/element-ui/lib/index.js"></script>

    <script>
        let id = getUrlParam("id");
    </script>

    <style>
        #calendar{
            margin-right:40px;
        }

        .myInput{
            left:90px;
            top:-14px;
        }

        #mapContainer{
            height: 300px;
            background-color: #dd6161;
        }


    </style>
</head>
<body>
<div id="app">

    <div id="mapContainer"></div>
</div>

</body>
<script>
   new Vue({

       el:"#app",
       data:{

       },
       methods:{

       },

       created(){

           //实现地图的初始化
           let map = new BMap.Map("mapContainer");
           map.centerAndZoom("合肥", 16);

           //开启鼠标滚轮缩放
           map.enableScrollWheelZoom(true);

           //添加控件
           map.addControl(new BMap.NavigationControl()); // 平移缩放控件
           map.addControl(new BMap.ScaleControl()); //  比例尺
           map.addControl(new BMap.OverviewMapControl()); // 缩略图
           // map.addControl(new BMap.MapTypeControl()); //地图类型

           //发送请请求获取所有的地址
           axios.get("/address/findAll.do")
               .then(function(resp){

                   if(resp.data.flag){
                       let addressList = resp.data.data;

                       for (let i = 0; i < addressList.length; i++) {

                           let tempAddress = addressList[i];
                           let lon = tempAddress.address.split(",")[0];
                           let lat = tempAddress.address.split(",")[1];

                           let point = new BMap.Point(lon, lat);

                           // 创建标注
                           let marker = new BMap.Marker(point);

                           marker.setLabel(new BMap.Label(tempAddress.name+"<br/>" + tempAddress.address , {offset: new BMap.Size(20, -10)}));

                           marker.setAnimation(BMAP_ANIMATION_BOUNCE);

                           // 将标注添加到地图中
                           map.addOverlay(marker);

                       }


                   }else{

                       this.$message.warning(resp.data.message);

                   }

               })



       }


   })
</script>


</html>